/*
 * @Author: 飞越疯人院 353362604@qq.com
 * @Date: 2022-11-04 14:02:57
 * @LastEditors: 飞越疯人院 353362604@qq.com
 * @LastEditTime: 2022-11-21 16:40:44
 * @FilePath: \adminstration\src\Common\Scenes\Mars3d\Mars3d.jsx
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 */
import ReactDOM from 'react-dom'
import { boundaryUrl } from '../../Configure/CommonParameter'
import {
    configData,
    SceneOptions,
    GlobeOptions,
    CameraOptions,
    MaskRangeData,
    SystemComponents,
    CustomizeNavigation,
    WeatherAttributeData,
} from './Data'

const { mars3d, Cesium } = window

export const Initialization = ({ MapBox, type, Scene, Layer }) => {
    // 初始化的图层
    Scene.layer.forEach(key => (configData.layers.find(v => v.id === key).show = true))
    // 初始化地图
    const map = new mars3d.Map(MapBox.current, configData)
    const gra = new mars3d.layer.GraphicLayer()
    map.addLayer(gra)
    InitializationScene({ map, Scene, type })
    InitializationLayer({ map, Layer, type })
    return { map, gra }
}

// 初始化基础图层
const InitializationScene = ({ map, Scene, type }) => {
    // TODO 通用数据
    // 地图基础参数设置
    let sceneData = {}
    SceneOptions.forEach(key => (sceneData = { ...sceneData, [key]: Scene[key] }))
    let globe = {}
    GlobeOptions.forEach(key => (globe = { ...globe, [key]: Scene[key] }))
    let cameraController = {}
    CameraOptions.forEach(key => (cameraController = { ...cameraController, [key]: Scene[key] }))
    sceneData = { ...sceneData, globe, cameraController }
    map.setSceneOptions(sceneData)
    map.basemap = Scene.basemaps ? Scene.basemap : undefined
    // 系统组件控制
    SystemComponents.forEach(key => (map.controls[key].show = Scene[key]))
    // 自定义组件控制
    CustomizeNavigation.forEach(key => {
        if (key === 'layerManagement') InsertNavLabelLayerManagement({ map, enabled: Scene[key] })
    })
    // 天气效果
    WeatherAttributeData.forEach(key => EffectList[key](map, Scene[key]))
}

// 初始化矢量图层
const InitializationLayer = ({ map, Layer }) => {
    // TODO 图层数据
    const {
        boundData,
        maskState,
        maskColor,
        polygonStart,
        polygonColor,
        strokeState,
        strokeColor,
        strokeWidth,
        strokeText,
        strokeTextColor,
        wallState,
        wallColor,
        wallHeight,
        different,
        differentColor,
    } = Layer
    // GeoJson 省市边界设置
    if (boundData) {
        if (maskState) drawBoundMask({ Map: map, name: boundData, state: maskState, color: maskColor })
        if (polygonStart) drawBoundPolygon({ Map: map, name: boundData, state: polygonStart, color: polygonColor })
        if (strokeState)
            drawBoundStroke({
                Map: map,
                name: boundData,
                state: strokeState,
                color: strokeColor,
                width: strokeWidth,
                text: strokeText,
                textColor: strokeTextColor,
            })
        if (wallState)
            drawBoundWall({ Map: map, name: boundData, state: wallState, color: wallColor, height: wallHeight })
    }
    if (different && different?.length !== 0) drawBoundDifferent({ Map: map, different, differentColor })
}

// 插入导航标签
export const InsertNavLabelLayerManagement = ({ map, enabled }) => {
    let hasSelected = false
    const layerManagement = new mars3d.control.ToolButton({
        id: 'layerManagement',
        title: '图层管理',
        icon: 'http://mars3d.cn/img/icon/bookmark-one.svg',
        insertIndex: 1, // 插入的位置顺序, 1是home按钮后面
        click: () => {
            hasSelected = !hasSelected
            if (hasSelected) {
                mars3d.DomUtil.addClass(layerManagement.container, 'layerManagement')
                console.log('选中')
            } else {
                mars3d.DomUtil.removeClass(layerManagement.container, 'layerManagement')
                console.log('取消选中')
            }
        },
    })
    map.addControl(layerManagement)
    const DOM = document.getElementById('layerManagement')
    ReactDOM.findDOMNode(DOM).style.display = enabled ? 'inline-block' : 'none'
}

// 地图场景效果
const EffectList = {
    fogEffect: (map, enabled) => map.addEffect(new mars3d.effect.FogEffect({ enabled })),
    rainEffect: (map, enabled) => map.addEffect(new mars3d.effect.RainEffect({ enabled })),
    snowEffect: (map, enabled) => map.addEffect(new mars3d.effect.SnowEffect({ enabled })),
    snowCover: (map, enabled) => map.addEffect(new mars3d.effect.SnowCoverEffect({ enabled })),
    bloomEffect: (map, enabled) => map.addEffect(new mars3d.effect.BloomEffect({ enabled })),
    brightnessEffect: (map, enabled) => map.addEffect(new mars3d.effect.BrightnessEffect({ enabled })),
    nightVisionEffect: (map, enabled) => map.addEffect(new mars3d.effect.NightVisionEffect({ enabled })),
    blackAndWhiteEffect: (map, enabled) => map.addEffect(new mars3d.effect.BlackAndWhiteEffect({ enabled })),
    mosaicEffect: (map, enabled) => map.addEffect(new mars3d.effect.MosaicEffect({ enabled })),
    depthOfField: (map, enabled) => map.addEffect(new mars3d.effect.DepthOfFieldEffect({ enabled })),
    outlineEffect: (map, enabled) => {
        map.addEffect(
            new mars3d.effect.OutlineEffect({ color: '#FFFF00', width: 4, eventType: mars3d.EventType.click, enabled }),
        )
    },
    bloomTargetEffect: (map, enabled) => {
        map.addEffect(
            new mars3d.effect.BloomTargetEffect({
                eventType: mars3d.EventType.click,
                color: Cesium.Color.WHITE,
                contrast: 119,
                brightness: 0.05,
                delta: 0.9,
                sigma: 3.78,
                stepSize: 5,
                enabled,
            }),
        )
    },
}

// TODO 主场景底图模式设置函数
// *** 边界墙
export const drawBoundWall = ({ Map, name, state, color, height = 250000 }) => {
    const boundWall = new mars3d.layer.GeoJsonLayer({
        id: 'boundWall',
        name,
        url: boundaryUrl + name + '.json',
        show: state,
        symbol: {
            type: 'wallP',
            styleOptions: {
                setHeight: -height,
                diffHeight: height,
                materialType: mars3d.MaterialType.Image2,
                image: 'http://mars3d.cn/img/textures/fence-top.png',
                color: color,
            },
        },
    })
    Map.addLayer(boundWall)
}
// *** 内边线
export const drawBoundStroke = ({ Map, name, state, color, width = 1, text, textColor = '#262626' }) => {
    const boundStroke = new mars3d.layer.GeoJsonLayer({
        id: 'boundStroke',
        name,
        url: boundaryUrl + '全' + name + '.json',
        show: state,
        symbol: {
            type: 'polylineP',
            styleOptions: {
                color: color,
                width: width,
                label: {
                    text: text ? '{name}' : '',
                    // position: "center",
                    font_size: 40,
                    color: textColor,
                    font_family: 'YouSheBiaoTiHei',
                    outline: true,
                    outlineColor: '#f8f8f8',
                    outlineWidth: 3,
                    // 视距的设置
                    scaleByDistance: true,
                    scaleByDistance_far: 20000000,
                    scaleByDistance_farValue: 0.1,
                    scaleByDistance_near: 1000,
                    scaleByDistance_nearValue: 1,
                },
            },
        },
    })
    Map.addLayer(boundStroke)
}
// *** 平面
export const drawBoundPolygon = ({ Map, name, state, color }) => {
    const boundPolygon = new mars3d.layer.GeoJsonLayer({
        id: 'boundPolygon',
        name,
        url: boundaryUrl + name + '.json',
        show: state,
        allowDrillPick: true,
        symbol: {
            type: 'polygonP',
            styleOptions: {
                flat: false,
                // materialType: mars3d.MaterialType.Image,
                // materialOptions: {
                //     // image:'https://image.ljkjkf.com/intellisiteSystem_TieKe/BaDa/微信切图.png',
                //     // transparent:true
                //     // color: color,
                //     // alphaPower: 1.5,
                //     // diffusePower: 1.6,
                //     // center: new Cesium.Cartesian2(0.8, 0.8),
                // },
                color: color,
            },
        },
    })
    Map.addLayer(boundPolygon)
}
// *** 遮罩
export const drawBoundMask = ({ Map, name, state, color }) => {
    const boundMask = new mars3d.layer.GeoJsonLayer({
        id: 'boundMask',
        name,
        url: boundaryUrl + name + '.json',
        show: state,
        mask: { xmin: 73.0, xmax: 136.0, ymin: -10.0, ymax: 59.0 },

        // allowDrillPick: true,
        symbol: {
            styleOptions: {
                fill: true,
                color: color,
                arcType: Cesium.ArcType.GEODESIC,
                clampToGround: true,
            },
        },
    })
    Map.addLayer(boundMask)
}

// *** 独立图层
export const drawBoundDifferent = ({ Map, different, differentColor }) => {
    different.forEach(key => {
        const boundPolygon = new mars3d.layer.GeoJsonLayer({
            id: `Different${key}polygonP`,
            name: `${key}`,
            url: boundaryUrl + key + '.json',
            symbol: {
                type: 'polygonP',
                styleOptions: {
                    color: differentColor[key],
                    height: 100,
                },
            },
        })
        Map.addLayer(boundPolygon)

        const boundWallP = new mars3d.layer.GeoJsonLayer({
            id: `Different${key}wallP`,
            name: `${key}`,
            url: boundaryUrl + key + '.json',
            show: false,
            symbol: {
                type: 'wallP',
                styleOptions: {
                    materialType: mars3d.MaterialType.LineFlow,
                    materialOptions: {
                        image: 'http://mars3d.cn/img/textures/fence.png',
                        color: differentColor[key],
                        mixt: true,
                        speed: 20, // 速度，建议取值范围1-100
                        axisY: true,
                    },
                    color: differentColor[key],
                    diffHeight: 50000,
                },
            },
        })
        Map.addLayer(boundWallP)
    })
}
